<template>
	<view class="container">
		<!-- 订单信息 -->
		<view class="order-info">
			<view class="info-row">
				<text class="label">订单号：</text>
				<text class="value">{{ orderNo }}</text>
			</view>
		</view>
		<!-- 交款金额 -->
		<view class="order-info" v-if="orderData.orderType == 2">
			<view class="info-row">
				<text class="label">交款金额：</text>
				<text class="value">{{ totalAmount }}</text>
			</view>
		</view>
		<!-- 转账记录上传 -->
		<view class="transfer-record-upload">
			<view class="transfer-record-upload-title">{{ orderData.orderType == 2 ? '佣金交款记录上传' : '欠款补交记录上传' }}<text style="color: #ff4069;">*</text></view>
			<js-uploadfile v-model="image.dataMap" :biz-key="image.id" biz-type="order_transfer_image"></js-uploadfile>
		</view>
		
		<!-- 备注 -->
		<view class="remarks-section">
			<view class="remarks-header">
				<text class="remarks-label">备注</text>
				<text class="remarks-limit">限30字</text>
			</view>
			<textarea 
				class="remarks-input" 
				v-model="remarks" 
				placeholder="请填写备注信息"
				maxlength="30"
			></textarea>
		</view>
		
		<!-- 提交按钮 -->
		<view class="submit-container">
			<view class="submit-btn" v-if="!isAllOrder" @click="submitPayment">
				<text class="submit-text">{{ orderData.orderType == 2 ? '佣金交款' : '补交欠款' }}</text>
			</view>
            <view class="submit-btn" v-if="isAllOrder" @click="submitAllPayment">
                <text class="submit-text">审核通过</text>
            </view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			orderNo: '',
			orderId: '',
			totalAmount: 0,
			orderData: {},
			remarks: '',
			isAllOrder: false,
			fromDetails: false, // 标记是否从详情页跳转进来
			image: {
				dataMap: {
					order_transfer_image: '',
					order_transfer_image__del: ''
				},
				id: ''
			}
		}
	},
	onLoad(options) {
		// 判断是否从详情页跳转进来（通过检查页面栈）
		const pages = getCurrentPages()
		if (pages.length >= 2) {
			const prevPage = pages[pages.length - 2]
			if (prevPage && prevPage.route && prevPage.route.includes('orderDetails')) {
				this.fromDetails = true
			}
		}
		
		if (options.isAllOrder) {
			this.isAllOrder = JSON.parse(options.isAllOrder)
		}
		
		if (options.order) {
			let order = JSON.parse(options.order)
			this.orderData = order
			this.orderNo = order.orderNo
			this.orderId = order.id
			this.totalAmount = order.totalCostPrice - order.totalPrice
			
			if (this.isAllOrder) {
				// 如果是审核页面，使用订单ID作为bizKey
				this.image.id = order.id
                this.remarks = order.remark
			}
		}
	},
	methods: {
		// 提交补交
		submitPayment() {
			// 验证是否上传了补交记录
			if (!this.image.dataMap.order_transfer_image) {
				uni.showToast({
					title: '请上传' + (this.orderData.orderType == 2 ? '佣金交款记录' : '欠款补交记录'),
					icon: 'none'
				})
				return
			}
			
			// 构建请求参数
			const params = {}
			params.orderId = this.orderId
			params.remark = this.remarks || ''
			
			// 添加图片相关参数
			if (this.image.dataMap.order_transfer_image) {
				params['dataMap[order_transfer_image]'] = this.image.dataMap.order_transfer_image
			}
			if (this.image.dataMap.order_transfer_image__del) {
				params['dataMap[order_transfer_image__del]'] = this.image.dataMap.order_transfer_image__del
			}
			
			console.log('提交补交参数:', params)
			
			uni.showLoading({
				title: '提交中...',
				mask: true
			})
			
			// 调用欠款补交接口
			this.$u.api.orderManagement.payDebt(params).then(res => {
				uni.hideLoading()
				
				if (res && res.result === 'true') {
					uni.showToast({
						title: this.orderData.orderType == 2 ? '佣金交款成功' : '补交欠款成功',
						icon: 'success'
					})
					
					// 延迟返回
					setTimeout(() => {
						if (this.fromDetails) {
							// 如果从详情页来，返回到订单列表页面
							// uni.reLaunch({
							// 	url: '/pages/inventoryManagement/orderList'
							// })
							uni.navigateBack({
								delta: 2
							})
						} else {
							uni.navigateBack()
						}
					}, 1500)
				} else {
					uni.showToast({
						title: res.message || (this.orderData.orderType == 2 ? '佣金交款提交失败' : '补交欠款提交失败'),
						icon: 'none'
					})
				}
			}).catch(err => {
				uni.hideLoading()
				console.error(this.orderData.orderType == 2 ? '佣金交款提交失败' : '补交欠款提交失败:', err)
				uni.showToast({
					title: '提交失败，请重试',
					icon: 'none'
				})
			})
		},
		// 审核通过
		submitAllPayment() {
			uni.showModal({
				title: '提示',
				content: '确定审核通过该订单吗？',
				success: (res) => {
					if (res.confirm) {
						this.approvePayment()
					}
				}
			})
		},
		// 调用审核通过接口
		approvePayment() {
			uni.showLoading({
				title: '审核中...',
				mask: true
			})
			
			this.$u.api.orderManagement.paymentApprove({
				orderId: this.orderId
			}).then(res => {
				uni.hideLoading()
				
				if (res && res.result === 'true') {
					uni.showToast({
						title: '审核通过成功',
						icon: 'success'
					})
					
					// 延迟返回
					setTimeout(() => {
						if (this.fromDetails) {
							// uni.reLaunch({
							// 	url: '/pages/inventoryManagement/allOrderList'
							// })
							uni.navigateBack({
								delta: 2
							})
						} else {
							uni.navigateBack()
						}
					}, 1500)
				} else {
					uni.showToast({
						title: res.message || '审核失败',
						icon: 'none'
					})
				}
			}).catch(err => {
				uni.hideLoading()
				console.error('审核失败:', err)
				uni.showToast({
					title: '审核失败，请重试',
					icon: 'none'
				})
			})
		}
	}
}
</script>

<style scoped>
.container {
	background-color: #f5f5f5;
	padding-bottom: 100px;
}

/* 订单信息 */
.order-info {
	background-color: #ffffff;
	padding: 20px;
	margin-bottom: 10px;
}

.info-row {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}

.info-row:last-child {
	margin-bottom: 0;
}

.label {
	font-size: 14px;
	color: #666666;
	min-width: 80px;
}

.value {
	font-size: 14px;
	color: #333333;
	flex: 1;
}

/* 转账记录上传 */
.transfer-record-upload {
	background-color: #ffffff;
	padding: 20px;
	margin-bottom: 10px;
}

.transfer-record-upload-title {
	font-size: 16px;
	color: #333333;
	margin-bottom: 15px;
	font-weight: bold;
}

/* 备注 */
.remarks-section {
	background-color: #ffffff;
	padding: 20px;
	margin-bottom: 10px;
}

.remarks-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 15px;
}

.remarks-label {
	font-size: 16px;
	color: #333333;
	font-weight: bold;
}

.remarks-limit {
	font-size: 14px;
	color: #999999;
}

.remarks-input {
	width: 100%;
	max-height: 70px;
	padding: 15px;
	border: 1px solid #f0f0f0;
	border-radius: 8px;
	font-size: 14px;
	color: #333333;
	background-color: #fafafa;
	box-sizing: border-box;
}

/* 提交按钮 */
.submit-container {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #ffffff;
	padding: 15px 20px;
	border-top: 1px solid #f0f0f0;
}

.submit-btn {
	height: 45px;
	background-color: #ff4069;
	border-radius: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.submit-text {
	font-size: 16px;
	color: #ffffff;
	font-weight: bold;
}
</style>

